<template>
	<view class="content">
		<view class="content-log">
			<view class="logt1"><text class="log-t1">PengLin鹏邻</text></view>
			<view class="logt2"><text class="logt-t2">金鹏物业二手房</text></view>
		</view>

		<view class="content-title">
			<view class="title-t"><text>登录后才能委托卖房/出租、买房/租房,查看自己委托的内容</text></view>
		</view>

		<view class="content-but">
			<button plain="true" class="butt" open-type="getUserInfo" @getuserinfo="getUserInfo"><text>微信授权登录</text></button>
		</view>

		<!-- 及时反馈组件 -->
		<HMmessages ref="HMmessages" @complete="HMmessages = $refs.HMmessages" @clickMessage="clickMessage"></HMmessages>
	</view>
</template>

<script>
// 引入公用存储用户登录
import { login } from '../../../common/list.js';
// 引入即可反馈组件
import HMmessages from '../../../components/HM-messages/HM-messages.vue';
var { log } = console; // 解构
export default {
	components: { HMmessages },
	data() {
		return {};
	},
	methods: {
		// 发起登录取到用户信息
		getUserInfo(event) {
			console.log(event);
			// 存储用户信息到user数据库
			let user = event.detail.userInfo;
			login(user)
				.then(res => {
					console.log(res);
					// 存储到vuex数据仓库
					// this.$store.commit('openidmuta',res.data[0]._openid)
					// 登陆成功
					this.$nextTick(() => {
						//dom更新循环结束之后的延迟回调
						this.HMmessages.show('登陆成功', { icon: 'success', iconColor: '#ffffff', fontColor: '#ffffff', background: 'rgba(240, 142, 35, 0.8)' });
					});
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						});
					}, 1500);
				})
				.catch(err => {
					console.log(err);
				});
		}
	}
};
</script>

<style scoped>
.content {
	display: flex;
	flex-direction: column;
}
.content-log {
	height: 400upx;
}

.logt1 {
	margin-top: 90upx;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.logt2 {
	margin-top: 10upx;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.log-t1 {
	font-size: 70upx;
	font-weight: bold;
	color: #f08e23;
	letter-spacing: 8upx;
}
.logt-t2 {
	font-size: 35rpx;
	font-weight: bold;
	color: #8e8e8e;
	letter-spacing: 30upx;
}
/* 	.content-log text{
		letter-spacing: 20upx;
		font-size: 40upx;
		color: #7f7f7f;
	} */
.content-title {
	width: 100%;
}
.title-t {
	margin: 0 auto;
	width: 70%;
	/* background-color: #9befff; */
	text-align: center;
}
.title-t text {
	font-size: 30upx;
	color: #8e8e8e;
	letter-spacing: 3upx;
}
.content-but {
	margin-top: 50upx;
	width: 100%;
}
.butt {
	width: 90%;
	margin: 0 auto;
	background-color: #f08e23;
	border: none;
	border-radius: 40upx;
}
.butt text {
	font-size: 34upx;
	letter-spacing: 10upx;
	color: #ffffff;
}
</style>
